var gulp = require("gulp");

var htmlclean = require("gulp-htmlclean");//压缩html文件
var imagemin = require("gulp-imagemin");//压缩图片文件
var newer = require("gulp-newer");//判断是都是新文件
var stripbug = require("gulp-strip-debug");//去除console.log/debugger语句
var uglify = require("gulp-uglify");//压缩js文件
var gulpless = require("gulp-less");//压缩less文件
var concat = require("gulp-concat");//文件合并
var postcss = require("gulp-postcss");//可以将CSS解析成抽象语法树
var autoprefixer = require("autoprefixer");//使用gulp-autoprefixer根据设置浏览器版本自动处理浏览器前缀。使用她我们可以很潇洒地写代码，不必考虑各浏览器兼容前缀。【特别是开发移动端页面时，就能充分体现它的优势。例如兼容性不太好的flex布局。】
var cssnano = require("cssnano");//缩小css文件
var connect = require("gulp-connect");
// var cleancss = require("gulp-clean-css");//缩小css文件

var folder = {
    src: "src/",
    build: "build/"
}

var devMode = process.env.NODE_ENV == "development";
//gulp.src()//读取文件
//gulp.dest()写文件d
//gulp.task()//任务
//gulp.watch()//监听

// 任务
gulp.task("html", function () {
    var page = gulp.src(folder.src + "html/*")
    if (!devMode) {
        page.pipe(htmlclean());
    }
    page.pipe(gulp.dest(folder.build + "html")).pipe(connect.reload());
});

gulp.task("image", function () {
    gulp.src(folder.src + "images/*")
        .pipe(newer(folder.build + "/images"))
        .pipe(imagemin())
        .pipe(gulp.dest(folder.build + "images"));
});
// 把js文件压缩并合并到main.js里面
gulp.task("js", function () {
    var page = gulp.src(folder.src + "js/*");
    // if (!devMode) {
        console.log("js压缩合并");
        page.pipe(stripbug())
            .pipe(concat("main.js"))
            .pipe(uglify())
            .pipe(newer(folder.build +"/js"))
    // }
    // 

    // page.pipe(gulp.dest(folder.build + "js")).pipe(connect.reload());
});

gulp.task("css", function () {
    var options = [autoprefixer(), cssnano()];
    var page = gulp.src(folder.src + "css/*")
                    .pipe(connect.reload())
                        .pipe(gulpless());
    if (!devMode) {
        page.pipe(postcss(options))
    }
    page.pipe(gulp.dest(folder.build + "css"));
});

//加监听
gulp.task("watch",function(){
    gulp.watch(folder.src + "html/*",["html"]);
    gulp.watch(folder.src + "js/*",["js"]);
    gulp.watch(folder.src + "css/*",["css"]);
    gulp.watch(folder.src + "images/*",["images"]);
});

gulp.task("server",function(){
    connect.server({
        port:"8090",
        livereload:true //浏览器自动刷新
    });
})

gulp.task("default", ["html", "image", "js", "css","watch","server"]);